<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="./jquery-3.3.1.min.js"></script>
    <title>Document</title>
    <script>
        $(function(){
            //attr(属性名) 获取属性
            //attr(属性名,属性值) 设置属性
            // $("span").attr("data-id","1002")
            // console.log($("span").attr("id"))
            // console.log($("span").attr("data-id"))
        //     var chk =$("#sex").prop("checked")
        //     console.log(chk)
         
        //     var chk2 =  $("#sex").attr("checked")//checked
        //  console.log(chk2)

        //  $(":checkbox").attr("checked",true)
        //  //$(":checkbox").prop("checked",true)
          $("#sex").change(function(){
            //$(":checkbox").prop("checked",false)
           var chk1 = $(this).prop("checked")
           $(":checkbox").prop("checked",chk1)
          
          })
          $("#sex2").change(function(){
              $(":checkbox:not([id])").each(function(index,item){
                  
                 var ck= $(item).prop("checked")
                 $(item).prop("checked",!ck)
              })
            })
            //没有参数时获取,带参数时设置
            //html () div<span>span</span>  包含html标签的代码
            //text divspan  纯文本
            // val  ""空,交互控件的值（表单控件）
           //在设置时, html会解析其中的标签, text不会解析, 只是原样输出


        // var html =$("div").html();
        // var text =$("div").text();
        // var val =$("div").val();
        // console.log(html,text,val)
        // $("div").html("<h1>h1</h1>")

         
        //$("div").css("color","red")

        // $("div").width()
        // $("div").css("width")
        })
    </script>
</head>
<body>
    <div class="a b" >div<span>span</span></div>
   <form action="#">
      <span id="span" data-id="1001">姓名</span>
      <input type="text" name="name">
      <br>
      <input type="checkbox" name="sex" id="sex">
      <label for="sex">全选/全不选</label>
      <input type="checkbox" name="sex" id="sex2">
      <label for="sex">反选</label>
   </form>
   <input type="checkbox" name="" value="" >
   <input type="checkbox" name="" >
   <input type="checkbox" name="" >
</body>
</html>